import React,{useEffect} from 'react'
import {useDispatch,useSelector} from 'react-redux'
import '../../api/index'
import axios from 'axios'
import { ListFormat } from 'typescript'
import {useNavigate} from 'react-router-dom'

export default function Fl() {
  const Dispatch=useDispatch()
  const navigate=useNavigate()
  useEffect(()=>{
  axios.get('/list', {
    params: {}
  }).then((ret) => {
    console.log(ret.data)
    Dispatch({
      type:"get",
      payload:ret.data.list
    })
  })
  },[])

  const list=useSelector((state:any)=>{
    return state.list
  })
  console.log(list);
  const aa=(item:any)=>{
console.log(item);
navigate(`/xq/${item.id}`,{state:item})
  }

  return (
    <div>Fl
    {list.map((item:any,index:any)=>{
      return <li key={index} onClick={()=>aa(item)}>{item.title}
      <p><img src={item.img} alt="" /></p>
      </li>
    })}
    </div>
  )
}
